<template>
    <div class="mainDiv">
            <div class="rowHead" style="box-sizing: border-box;">
                <el-select style="width: 100%" v-model="selsubid" multiple filterable allow-create @change="querySubjects" placeholder="请选择项目所属分类标签">
                    <el-option v-for="c in cates" :label="c.name" :value="c.id">
                    </el-option>
                </el-select>
            </div>
            <el-row :gutter="20" class="rowHead" style="padding: 10px">
	            <el-col :span="15">
	                <el-tag type="primary">机构未拉取项目列表</el-tag>
	                <el-table :data="sublist" :stripe="true" height="500">
	                    <el-table-column prop="number" label="编号"></el-table-column>
	                    <el-table-column prop="name" label="项目"></el-table-column>
	                    <el-table-column prop="price" label="价格"></el-table-column>
	                    <el-table-column prop="xstdtype" label="销售提成">
	                        <template slot-scope="scope">
	                            <el-tag type="primary" size="mini" v-if="scope.row.xstdtype==1">{{Number(scope.row.xspercent*100).toFixed(0)+'%'}}</el-tag>
	                            <el-tag type="success" size="mini" v-else>{{scope.row.xsfixed+'元'}}</el-tag>
	                        </template>
	                    </el-table-column>
	                    <el-table-column prop="sgtdtype" label="手工提成">
	                        <template slot-scope="scope">
	                            <el-tag type="primary" size="mini" v-if="scope.row.sgtdtype==1">{{Number(scope.row.sgpercent*100).toFixed(0)+'%'}}</el-tag>
	                            <el-tag type="success" size="mini" v-else>{{scope.row.sgfixed+'元'}}</el-tag>
	                        </template>
	                    </el-table-column>
	                    <el-table-column prop="khtdtype" label="卡耗提成">
	                        <template slot-scope="scope">
	                            <el-tag type="primary" size="mini" v-if="scope.row.khtdtype==1">{{Number(scope.row.khpercent*100).toFixed(0)+'%'}}</el-tag>
	                            <el-tag type="success" size="mini" v-else>{{scope.row.khfixed+'元'}}</el-tag>
	                        </template>
	                    </el-table-column>
	                    <el-table-column label="拉取">
	                        <template slot-scope="scope">
	                            <el-button type="primary" icon="el-icon-check" size="mini" plain @click="pull(scope.row)"></el-button>
	                        </template>
	                    </el-table-column>
	                </el-table>
	            </el-col>
	            <el-col :span="9">
	                <el-tag type="primary">分店待拉取项目列表</el-tag>
	                <el-table :data="addsub" :stripe="true" height="500">
	                    <el-table-column prop="number" label="编号"></el-table-column>
	                    <el-table-column prop="name" label="项目"></el-table-column>
	                    <el-table-column prop="price" label="价格"></el-table-column>
	                    <el-table-column label="移除">
	                        <template slot-scope="scope">
	                            <el-button type="danger" icon="el-icon-close" size="mini" plain @click="remove(scope.row)"></el-button>
	                        </template>
	                    </el-table-column>
	                </el-table>
	            </el-col>
            </el-row>
            <div class="rowHead">
                <el-button type="success" size="mini" icon="el-icon-upload" @click="submit">确定拉取</el-button>
                <el-button type="danger" size="mini" icon="el-icon-close" @click="close">取消关闭</el-button>
            </div>
        </div>
</template>
<script>
import C from '#/src/common/common.js'

export default {
    name: 'pullSubject',
    data() {
        return {
            cates: [], // 机构项目分类集合
            selsubid: [], // 分类id集合
            sublist: [], // 通过分类id集合而获取的项目列表
            addsub: [], // 正在添加的项目集合
        }
    },
    methods: {

        submit: async function() {
            if (!this.addsub.length) {
                C.error('请选择需要拉取的项目')
                return false
            }

            let pullids = []
            this.addsub.forEach((v) => {
                pullids.push(v.id)
            })

            let data = await C.ajax('/shop/subject/pullsubjects', { data: JSON.stringify(pullids) }, 'post')
            if (data) {
                C.closeBrowserWindow(data.data)
            }
        },

        close: function() {
            C.closewin()
        },

        pull: function(row) {
            if (C.inarray({ id: row.id }, this.addsub) !== -1) {
                C.error('需要拉取的项目重复！')
                return false
            }
            this.addsub.push(row)
        },

        remove: function(row) {
            let pos = C.inarray({ id: row.id }, this.addsub)
            this.addsub.splice(pos, 1)
        },

        querySubjects: async function(arr) {
            this.selsubid = arr
            let res = await C.ajax('/shop/subject/querysubjects', { cates: JSON.stringify(this.selsubid) }, 'post')
            if (res) {
                let subslists = []
                res.subjects.forEach((v, i) => {
                    if (res.existsub.indexOf(v.id) === -1) {
                        subslists.push(v)
                    }
                })
                this.sublist = subslists
            }
        },
    },
    mounted: async function() {
        let list = await C.ajax('/shop/subject/getorsubjectcategory', {}, 'post')
        if (list) {
            this.cates = list
        }
    }
}
</script>